<!DOCTYPE html>
<html lang="zh-cmn-Hans-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>设定网格系统</title>
    <!-- Bootstrap core CSS -->
    <link href="<?php echo base_url('application/views/bootstrap/css/bootstrap.css'); ?>" rel="stylesheet">
    <!-- 自定义样式表 -->
    <link href="<?php echo base_url('application/views/css/stock.css'); ?>" rel="stylesheet">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="<?php echo base_url('application/views/jQuery/jquery-2.2.3.min.js'); ?>"></script>
    <script src="<?php echo base_url('application/views/bootstrap/js/bootstrap.js'); ?>"></script>
    <!-- 引入layer插件，实现增强web弹窗和层效果 -->
    <script src="<?php echo base_url('application/views/layer/layer.js'); ?>"></script>
    <!-- 引入spinner插件的脚本和样式文件，方便数字输入 -->
    <script src="<?php echo base_url('application/views/jQuery/jquery.spinner.min.js'); ?>"></script>
    <link href="<?php echo base_url('application/views/css/bootstrap-spinner.css'); ?>" rel="stylesheet">
</head>

<body class="popbody">
    <div class="container-fluid">
        <div class="pop">
            <h1><?php echo $stockInfo[0]['sname'] ?></h1>
            <div class="table-responsive">
                <table class="table table-striped">
                    <tbody>
                        <tr>
                            <td class="col-sm-4">每股净资产</td>
                            <td class="col-sm-2">
                                <?php echo $netAssets['mgjzc']?>
                            </td>
                            <td class="col-sm-4">网格间距</td>
                            <td class="col-sm-2">
                                <div class="input-group spinner" data-trigger="spinner" id="gridsnap">
                                    <input type="text" class="form-control text-center" value="<?php echo $stockInfo[0]['gridInterval'] ?>" data-rule="quantity">
                                    <div class="input-group-addon">
                                        <a href="javascript:;" class="spin-up" data-spin="up">+</a>
                                        <a href="javascript:;" class="spin-down" data-spin="down">-</a>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>历史最低PB</td>
                            <td>
                                <?php echo $stockInfo[0]['lowpb']?>
                            </td>
                            <td>历史最高PB</td>
                            <td>
                                <?php echo $stockInfo[0]['toppb']?>
                            </td>
                        </tr>
                        <tr>
                            <td>估算最低价格</td>
                            <td id="lowprice">
                                <?php echo $netAssets['mgjzc'] * $stockInfo[0]['lowpb'] ?>
                            </td>
                            <td>估算最高价格</td>
                            <td id="topprice">
                                <?php echo $netAssets['mgjzc'] * $stockInfo[0]['toppb'] ?>
                            </td>
                        </tr>
                        <tr>
                            <td>52周最低价格</td>
                            <td id="low52week">
                            </td>
                            <td>52周最高价格</td>
                            <td id="high52week">
                            </td>
                        </tr>
                    </tbody>
            </div>
            <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>买入价格</th>
                            <th>PB</th>
                            <th>买入数量</th>
                            <th>买入金额</th>
                            <th>卖出价格</th>
                            <th>卖出数量</th>
                            <th>卖出金额</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr id="bs1">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs2">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs3">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs4">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs5">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs6">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs7">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr id="bs8">
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                        </tr>
                        <tr>
                            <td>合计</td>
                            <td></td>
                            <td></td>
                            <td id="total3"></td>
                            <td></td>
                            <td></td>
                            <td id="total6"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <p>
                <button type="button" class="btn btn-primary btn-lg" id="save">保存网格方案</button>
            </p>
        </div>
    </div>
    <script>
    function calculatGrid() {
        // 设定第8次买入的价格
        var b8Price = $('td#lowprice').html();
        var s8Price = $('td#topprice').html();
        // 取得网格密度
        var snap = $('#gridsnap input').val() / 100;
        // console.log(snap);

        // 使用循环计算买卖点价格
        for (var i = 8; i > 0; i--) {
            var s0 = 'tr#bs' + i + ' td:eq(0)';
            var s1 = 'tr#bs' + i + ' td:eq(1)';
            var s4 = 'tr#bs' + i + ' td:eq(4)';
            var p0 = Number(b8Price * (Math.pow(1 + snap, (8 - i)))).toFixed(2);
            var p1 = Number(p0 / <?php echo $netAssets['mgjzc']?>).toFixed(1);
            var p4 = Number(s8Price * (Math.pow(1 - snap, (8 - i)))).toFixed(2);
            // console.log(s);
            $(s0).text(p0);
            $(s1).text(p1);
            $(s4).text(p4);
        };

        // 计算第一次买入的数量
        var b1Amount = Math.ceil(100 / $('tr#bs1 td:eq(0)').html()) * 100;
        // console.log(b1Amount);
        // 循环写入买入数量
        for (var i = 1; i <= 8; i++) {
            var s2 = 'tr#bs' + i + ' td:eq(2)';
            var s5 = 'tr#bs' + i + ' td:eq(5)';
            var p2 = b1Amount + (i - 1) * 100;
            // console.log(s);
            $(s2).text(p2);
            $(s5).text(p2);
        };

        // 循环写入买入卖出金额
        var total3 = 0,
            total6 = 0;
        for (var i = 1; i <= 8; i++) {
            var s3 = 'tr#bs' + i + ' td:eq(3)';
            var s6 = 'tr#bs' + i + ' td:eq(6)';
            var p3 = Math.ceil($('tr#bs' + i + ' td:eq(0)').html() * $('tr#bs' + i + ' td:eq(2)').html());
            var p6 = Math.ceil($('tr#bs' + i + ' td:eq(4)').html() * $('tr#bs' + i + ' td:eq(5)').html());
            total3 = total3 + p3;
            total6 = total6 + p6;
            $(s3).text(p3);
            $(s6).text(p6);
        };
        $('td#total3').text(total3);
        $('td#total6').text(total6);

        // 写入52周高低值
        var slow = $('#low52week');
        var shigh = $('#high52week');
        var plow = <?php echo 'parent.xueqiuData.' . $stockInfo[0]['symbol'] . '.low52week' ?>;
        var phigh = <?php echo 'parent.xueqiuData.' . $stockInfo[0]['symbol'] . '.high52week' ?>;
        // console.log(<?php echo 'parent.xueqiuData.' . $stockInfo[0]['symbol'] . '.low52week' ?>);
        $(slow).text(plow);
        $(shigh).text(phigh);
    }

    $(document).ready(function() {
        // 初始化网格系统
        calculatGrid();

        // 为网格间距设定事件函数
        $('#gridsnap').spinner('changed', function() {
            // console.log('it works');
            calculatGrid();
        });

        // 为保存方案按钮设定事件函数
        $('#save').click(function() {
            // console.log('it works');
            // 使用Ajax请求发送表单数据。
            $.post("<?php echo site_url('selected/updateGridInterval')?>", {
                symbol: "<?php echo $stockInfo[0]['symbol']?>",
                gridInterval: $('#gridsnap input').val()
            }, function() {
                // 更改父页面的内容
                var s = "tr[id='" + "<?php echo $stockInfo[0]['symbol']?>" + "']" + " td.grid a";
                var t = $('#gridsnap input').val();
                // 设定父页面内容
                parent.$(s).text(t);
                var index = parent.layer.getFrameIndex(window.name);
                // 再执行关闭
                parent.layer.close(index);
            });
        });
    });
    </script>
</body>

</html>
